use yew::prelude::*;

#[derive(Debug, PartialEq, Properties)]
pub struct Props {
    pub title: AttrValue, //可理解为智能指针类型的String
    pub children: Children, //表示组件的子元素
}

#[function_component(Card)]
pub fn card(props: &Props) -> Html {
    html! {
        <article class="card" style="margin: auto; margin-top: 5%; width: 80%;">
            <header> //显示标题
                <h3> { &props.title } </h3>
            </header>
            <footer> //显示子元素
                { for props.children.iter() }
            </footer>
        </article>
    }
}